<template>
  <div class="dashboard-container">
    <component :is="currentRole" />
    <!--<el-col :span="4" style="height: 100%;">
                <el-card>
                    <el-tree :data="dataList" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
                </el-card>
        </el-col> -->
    <el-row style="margin-top: 20px;">
      <el-form ref="search_form" :model="search_form" label-width="80px">
        <el-col :span="4"> <el-form-item label="订单编号">
            <el-input v-model="search_form.order_number">
            </el-input>
          </el-form-item></el-col>
        <el-col :span="5">
          <el-form-item label="活动区域">
            <el-select v-model="search_form.region" placeholder="请选择活动区域">
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-date-picker v-model="search_form.order_time" type="date" placeholder="下单时间">
          </el-date-picker>
        </el-col>
        <el-col :span="2"> <el-button type="primary" @click="search_Bth">搜索</el-button>
          <el-button>重置</el-button></el-col>
        <!-- <el-col :span="2"></el-col> -->
      </el-form>
    </el-row>
    <el-row>
      <el-col>
        <div class="app-container">
          <el-table :data="tableData" border fit highlight-current-row style="width: 100%">
            <el-table-column prop="is_shop" label="订单编号">
            </el-table-column>
            <el-table-column prop="applicant" label="客户ID">
            </el-table-column>
            <el-table-column prop="is_customer" label="产品ID">
            </el-table-column>
            <el-table-column prop="respondent" label="店家ID">
            </el-table-column>
            <el-table-column align="center" label="下单时间">
              <template slot-scope="{row}">
                <span>{{ row.start_time }}</span>
              </template>
            </el-table-column>
            <!-- <el-table-column prop="order_time" label="下单时间">
                        </el-table-column> -->
            <el-table-column prop="amount" label="订单金额">
            </el-table-column>
            <el-table-column prop="ad_format" label="订单状态">
            </el-table-column>
          </el-table>
          <!-- <Pagination v-show="total > 0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit"
                        @pagination="getList" /> -->
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import adminDashboard from './admin'
import editorDashboard from './editor'
import { statistics, queryGoods } from '@/api/article'
import Pagination from '@/components/Pagination'
import { timestampToTime } from "@/utils"

export default {
  name: 'Dashboard',
  components: { adminDashboard, editorDashboard, Pagination },
  data() {
    return {
      statisticsObj: {},
      list: null,
      listLoading: false,
      currentRole: 'adminDashboard',
      page: "1",
      // listQuery: {
      //   page: 1,
      //   limit: 10
      // },
      total: 100,
      list: [],
      tableData: [],
      search_form: {}
    }
  },
  computed: {
    regionalData() {
      return this.$store.state.user.regionalData;
    }
  },
  methods: {
    queryStatistics() {
      statistics(this.regionalData).then(res => {
        this.statisticsObj =
          this.bus.$emit("statisticsObj", res[0].result);
      })
    },
    getList() {
      let params = {
        page: this.page,
        ...this.regionalData
      }
      console.log(params, "par");
      queryGoods(params).then(res => {
        res.result.forEach(item => {
          item.order_time = timestampToTime(item.order_time)
        });
        this.tableData = res.result
        console.log(this.tableData, 'this.dataList')
      })
    },
    search_Bth() {
      console.log(this.search_form, 'search_form')
    },
    handleNodeClick(data) {
      console.log(data);
    }
  },
  created() {
    // sudo_login_api({uname:'gengzeyang',password:'123456'})
    this.getList()
    this.queryStatistics()

  },

}
</script>
<style scoped>
.dashboard-container {
  width: 100%;
  height: 100%;
}

.edit-input {
  padding-right: 100px;
}

.cancel-btn {
  position: absolute;
  right: 15px;
  top: 10px;
}
</style>
